<template>
    <!-- 添加或修改参数配置对话框 -->
    <a-modal :title="title" v-model:visible="open" width="500px" append-to-body>
        <a-form ref="configRef" :model="form" :rules="rules" laba-width="80px">
            <a-form-item label="参数名称" prop="configName">
                <a-input v-model="form.configName" placeholder="请输入参数名称" />
            </a-form-item>
            <a-form-item label="参数键名" prop="configKey">
                <a-input v-model="form.configKey" placeholder="请输入参数键名" />
            </a-form-item>
            <a-form-item label="参数键值" prop="configValue">
                <a-input v-model="form.configValue" placeholder="请输入参数键值" />
            </a-form-item>
            <a-form-item label="系统内置" prop="configType">
                <a-radio-group v-model="form.configType">
                    <a-radio v-for="dict in sys_yes_no" :key="dict.value" :label="dict.value">{{ dict.label }}</a-radio>
                </a-radio-group>
            </a-form-item>
            <a-form-item label="备注" prop="remark">
                <a-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
            </a-form-item>
        </a-form>
    </a-modal>
</template>

<script setup name="configForm">
import { addConfig, getConfig, updateConfig } from "@/api/system/config";
const { proxy } = getCurrentInstance();
const { sys_yes_no } = proxy.useDict("sys_yes_no");

const configList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const dateRange = ref([]);

const data = reactive({
    form: {},
    queryParams: {
        pageNum: 1,
        pageSize: 10,
        configName: undefined,
        configKey: undefined,
        configType: undefined
    },
    rules: {
        configName: [{ required: true, message: "参数名称不能为空", trigger: "blur" }],
        configKey: [{ required: true, message: "参数键名不能为空", trigger: "blur" }],
        configValue: [{ required: true, message: "参数键值不能为空", trigger: "blur" }]
    }
});

const { queryParams, form, rules } = toRefs(data);


/** 取消按钮 */
function cancel() {
    open.value = false;
    reset();
}
/** 表单重置 */
function reset() {
    form.value = {
        configId: undefined,
        configName: undefined,
        configKey: undefined,
        configValue: undefined,
        configType: "Y",
        remark: undefined
    };
    proxy.resetForm("configRef");
}

function init(method, configId) {
    reset();
    open.value = true;
    if (method == 'add') {
        title.value = "添加参数";
    } else if (method == 'edit') {
        getConfig(configId).then(({ data }) => {
            form.value = data;
            title.value = "修改参数";
        });
    }
}

/** 提交按钮 */
function submitForm() {
    proxy.$refs["configRef"].validate(valid => {
        if (valid) {
            if (form.value.configId != undefined) {
                updateConfig(form.value).then(response => {
                    proxy.$modal.msgSuccess("修改成功");
                    open.value = false;
                    getList();
                });
            } else {
                addConfig(form.value).then(response => {
                    proxy.$modal.msgSuccess("新增成功");
                    open.value = false;
                    getList();
                });
            }
        }
    });
}
defineExpose({
    init
})
</script>